import React, { Component } from 'react';

const fn = (C)=>{
  return class extends Component{
    componentDidMount() {
      console.log('hello');
    }
    render() {
      return (
        <>
          <p>我是高阶组件添加的结构</p>
          <C></C>
        </>
      )
    }
  }
}
const ComA = class ComA extends Component {
  render() {
    return (
      <p>我是ComA</p>
    )
  }
}
const ComB = class ComB extends Component {
  render() {
    return (
      <p>我是ComB</p>
    )
  }
}
// 通过hoc强化ComA和ComB
const ComAFn = fn(ComA)
const ComBFn = fn(ComB)
class Hoc extends Component {
  render() {
    return (
      <div>
        {/* higherOrderComponent:HOC 高阶组件，本身是一个函数，参数和返回值都是组件 */}
        {/* 目的：批量强化组件，类似vue中的mixin */}
        <ComAFn></ComAFn>
        <ComBFn></ComBFn>
      </div>
    );
  }
}

export default Hoc;
